<template>
    <div class="block">
        <el-row class="block-item">
            <exSwitch label="分时" v-model="isTimeLine"></exSwitch>
            <exSwitch label="日线" v-model="isKLine"></exSwitch>
            <exSwitch label="港通" v-model="isGt"></exSwitch>
            <el-button type="primary" @click="query" size="mini" style="height:28px;">查询</el-button>
        </el-row>
        <el-row class="block-item">

            <div v-for="(item,idx) in list" :key="idx" class="chart-item ml5">
                <timeLine :code="item.code" size="mini" v-if="isTimeLine"></timeLine>
                <kLine :code="item.code" :isGt="isGt?2:1" size="mini" v-if="isKLine"></kLine>
            </div>
        </el-row>
    </div>
</template>


<script>

import timeLine from "@/components/chart/timeLine"
import kLine from "@/components/chart/kLine"

export default {
    components:{
        timeLine,
        kLine
    },
    data() {
        return {
            list :[],
            isTimeLine: true,
            isKLine: true,
            isGt: false,
        }
    },
    inject: ['getCompareList'],
    computed:{
    },
     

    mounted() {
        this.query()
    },

    methods: {
        query(){
            this.list=[];
            this.$nextTick(()=>{
                this.list = this.getCompareList() || [];
            })
        }
    }
}
</script>

<style lang="less" scoped>
.block-item{
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-items: center;
    align-content: flex-start;
}
.chart-item{
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-items: center;
    align-content: flex-start;
}

</style>
